<template>
  <div>
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh" finished-text="加载成功">
    <van-list class="margi" v-for="(item) in news" :key="item.id" @load="onLoad" >
      <van-row @click="getnewparticular(item.id)">
  <van-col span="4">
    <van-image
  width="42"
  height="42"
  :src="item.img_url"
/>
  </van-col>
  <van-col span="20" >
    <h5 class="tit">{{item.title}}</h5>
    <div class=" spanright"><span class="fl">发表时间：{{item.add_time|dateformat('YYYY-MM-DD')}}</span><span class="fr">点击：{{item.click}}</span></div>
  </van-col>
</van-row>
    </van-list>
    </van-pull-refresh>

  </div>
</template>
           
<script>
export default {
  data() {
    return {
       list: [],
      loading: false,
      finished: false,
      refreshing: false,
      news:{}
    };
  },
  methods: {
    async getnews() {
      const { data: res } = await this.$http.get("/api/getnewslist");
      
      this.news=res.message
      // console.log(this.news,11111)
    },    onLoad() {
      setTimeout(() => {
        if (this.refreshing) {
          this.list = [];
          this.refreshing = false;
        }

        for (let i = 0; i < 10; i++) {
          this.list.push(this.list.length + 1);
        }
        this.loading = false;

        if (this.list.length >= 40) {
          this.finished = true;
        }
      }, 1000);
    },
    onRefresh() {
      // 清空列表数据
      this.finished = false;

      // 重新加载数据
      // 将 loading 设置为 true，表示处于加载状态
      this.loading = true;
      this.onLoad();
      setTimeout(() => {
        this.$toast('刷新成功')
        this.isLoading = false;
      }, 1000);
    },
     getnewparticular(id){
      // console.log(id,666)
      // const {data:res} = await this.$http(`/api/getnew/${id}`)
              sessionStorage.setItem("newss", id);

      // console.log(res,2323)
      this.$router.push({name:'/newss',params:{id:id}})
      // console.log(2)
    }
    
  },
  created() {
    this.getnews();
  }
}
</script>
<style scoped lang="less">
*{
  margin: 0;
  padding: 0;
}
.margi {
  margin: 0 10px;
  padding: 10px;
  border-bottom: 1px solid #ccc;
}
van-row {
  height: 68px;
}
.tit {
  height: 17px;
  font-size: 14px;
  line-height: 17px;
  white-space:nowrap;
  overflow: hidden;
}
.spanright {
  font-size: 12px;
  line-height: 30px;
  height: 30px;
  color: #226AFF;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
</style>